import axios from '@/utils/request'
let store = 0
const STATUS = {
  '-1': '已取消',
  0: '未支付',
  1: '已支付'
}

export default {
  StoreFee: {
    entity: { name: 'Fee', prefix: () => {
      store = localStorage.getItem('storeId')
      return `store/${store}`
    } },
    list: {
      query: {
        '@filter': `entity.getType() == 'onboard-fee'`,
        '@order': 'entity.id|DESC',
        '@expands': '["entity.staff"]'
      },
      disabled_actions: ['edit'],
      list_filter: {
        name: {
          expression: `entity.getStaff().getName() matches ":value" || entity.getStaff().getUser().getUsername() matches ":value"`,
          label: '员工名/电话',
          type: 'input'
        },
        staffId: {
          expression: `entity.getStaff().getId() == ":value"`,
          label: '员工id',
          type: 'input'
        },
        status: Object.assign({ __label: '状态' }, STATUS)
      },
      list_display: [
        'id',
        'staff',
        { property: 'payer', label: '付款方' },
        { property: 'receiver', label: '收款方' },
        { property: 'amount', label: '金额', editable: true },
        {
          property: 'status',
          component: {
            props: ['data'],
            data() {
              return {
                status: STATUS
              }
            },
            render(h) {
              return <div>{this.status[this.data]}</div>
            }
          }
        },
        'comment',
        'paidTime',
        'createdTime'
      ]
    },
    form: {
      fields: [
        {
          property: 'staff',
          component: {
            props: ['form', 'property'],
            data() {
              return { data: [] }
            },
            created() {
              axios.get(`/store/${store}/staffs`, {
                params: {
                  'limit': 1000000
                }
              }).then((res) => {
                this.data = res.data
              })
            },
            render(h) {
              return (
                <el-select v-model={this.form[this.property]} clearable filterable>{
                  Object.assign(this.data).map(v => {
                    return <el-option key={v.id} label={v.name + '(' + v.phone + ')'} value={v.id} />
                  })
                }</el-select>
              )
            }
          }
        },
        {
          property: 'payer',
          field_options: { label: '付款方' },
          component: {
            data() {
              return { loading: false }
            },
            methods: {
              setInput(value) {
                if (value) {
                  this.loading = true
                  axios.get(`/store/${store}/staffs/${value}`)
                    .then((res) => {
                      this.form[this.property] = res.data.user.id
                    })
                    .catch(() => {
                      this.form[this.property] = null
                    })
                    .finally(() => {
                      this.loading = false
                    })
                } else {
                  this.form[this.property] = null
                }
              }
            },
            watch: {
              'form.staff': {
                handler(value, oldValue) {
                  this.setInput(value)
                },
                immediate: true
              }
            },
            props: ['form', 'property'],
            render(h) {
              return (
                <el-input v-model={this.form[this.property]} disabled={true} v-loading={this.loading}></el-input>
              )
            }
          }
        },
        {
          property: 'receiver',
          field_options: { label: '收款方' },
          component: {
            props: ['form', 'property'],
            data() {
              return { data: [] }
            },
            created() {
              axios.get(`/store/${store}/stores`, {
                params: {
                  'limit': 1
                }
              }).then((res) => {
                if (res.data.length > 0 && res.data[0].user) {
                  this.data.push({ id: res.data[0].user.id, name: '场所账户' })
                }
                this.data.push({ id: 105, name: '平台账户' })
              })
            },
            render(h) {
              return (
                <el-select v-model={this.form[this.property]} clearable filterable>{
                  Object.assign(this.data).map(v => {
                    return <el-option key={v.id} label={v.name} value={v.id} />
                  })
                }</el-select>
              )
            }
          }
        },
        { property: 'amount', field_options: { label: '金额' }},
        { property: 'type', type_options: { disabled: true }, default_value: 'onboard-fee' },
        { property: 'comment', type: 'textarea' }
      ]
    }
  }
}

